﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="InputAchievementPage_Backup.aspx.cs" Inherits="FBKPI.Pages.InputAchievementPage_Backup" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <script type="text/javascript">
    $(document).ready(function () {
        mainmenu("#nav ul", "#nav li");
        mainmenu("#menu_wrap ul", "#menu_wrap li");
        
        $('.date-picker').datepicker({
            changeMonth: true,
            changeYear: true,
            showYear: true,
            showButtonPanel: true,
            dateFormat: 'MM yy',
            onClose: function (dateText, inst) {
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                $(this).datepicker('setDate', new Date(year, month, 1));
            }
        });

        InitPage();

        $("#btn_back").click(function () {
            document.location = "../Achievement?User=" + $("#txt_user").val();
            return false;
        });

        $("#btn_count").click(function () {
            if ($("#MainContent_txt_realization").val() != '') {
                var Realization;
                var Max = ($("#MainContent_txt_kpiuommax").val().split(' || '))[1].toString();
                var Min = ($("#MainContent_txt_kpiuommin").val().split(' || '))[1].toString();
                var Score;
                
                if ($("#MainContent_txt_uomformat").val() == 'Month') {
                    Realization = $("#MainContent_txt_realizationmonth").val();
                    if (Realization == Max) Score = 100;
                    else if (Realization == Min) Score = 80
                    else Score = 0;
                } else if ($("#MainContent_txt_uomformat").val() == 'Numeric') {
                    Realization = $("#MainContent_txt_realization").val();
                    if (Realization - Max >= 0) Score = 100;
                    else if (Realization - Min >= 0) Score = 80
                    else Score = 0;
                } else {
                    Realization = $("#MainContent_txt_realization").val();
                    if (Realization == Max) Score = 100;
                    else if (Realization == Min) Score = 80
                    else Score = 0;
                }

                $("#MainContent_txt_score").val(Score);
                $("#MainContent_txt_scoreval").val(Score);
            } else alert('Please enter Realization');
            return false;
        });

        //datatable section
        $("#KPIChildTable").dataTable({
            "oLanguage": {
                "sZeroRecords": "No records to display",
                "sSearch": "Search"
            },
            "bSort": false,
            "sSearch": false,
            "bPaginate": true,
            "bAutoWidth": false,
            "bProcessing": true,
            "bServerSide": true,
            "bDestroy": true,
            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "bDeferRender": true,
            "fnServerData": function (sSource, aoData, fnCallback) {
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": "../Serializer/KPIChildExpandSerializer.ashx?User=" + $("#txt_user").val() + "&KPIParent=" + $("#MainContent_KPI").val(),
                    "data": aoData,
                    "success": fnCallback
                });
            },
            "aoColumns": [{
                "mData": "No"
            }, {
                "mData": "Description"
            }, {
                "mData": "isActive"
            }, {
                "mData": "GroupKPI"
            }, {
                "mData": "CategoryKPI"
            }, {
                "mData": "TypeKPI"
            }, {
                "mData": "SubTypeKPI"
            }, {
                "mData": "Periode"
            }, {
                "mData": "ID"
            }],
            "aoColumnDefs": [{
                "fnRender": function (oObj) {
                    return "<a href=\"#\" onclick=\"ShowAttachments('" + oObj.aData["ID"] + "')\">view</a>";
                },
                "aTargets": [8]
            }, {
                "fnRender": function (oObj) {
                    if (oObj.aData["isActive"] == 'True') {
                        return "<img src='../images/check.png' />"
                    } else {
                        return "<img src='../images/cross.png' />"
                    }
                },
                "aTargets": [2]
            }, {
                "sClass": "center",
                "aTargets": [0, 2, 8]
            }]
        });
        


        if ($("#MainContent_txt_achievementyear").val() != '') {
            $("#timeline").show();
            $("#timeline").dataTable({
                "oLanguage": {
                    "sZeroRecords": "No records to display",
                },
                "bFilter": false,
                "bInfo": false,
                "bSort": false,
                "bPaginate": false,
                "bAutoWidth": false,
                "bProcessing": true,
                "bServerSide": true,
                "bDestroy": true,
                "bJQueryUI": true,
                "bDeferRender": true,
                "fnServerData": function (sSource, aoData, fnCallback) {
                    $.ajax({
                        "dataType": 'json',
                        "type": "GET",
                        "url": "../Serializer/KPIAchievementTableSerializer.ashx?KPIAssign=" + $("#MainContent_KPIAssign").val() + "&Year=" + $("#MainContent_txt_achievementyear").val(),
                        "data": aoData,
                        "success": fnCallback
                    });
                },
                "aoColumns": [{
                    "mData": "Jan"
                }, {
                    "mData": "Feb"
                }, {
                    "mData": "Mar"
                }, {
                    "mData": "Apr"
                }, {
                    "mData": "May"
                }, {
                    "mData": "Jun"
                }, {
                    "mData": "Jul"
                }, {
                    "mData": "Aug"
                }, {
                    "mData": "Sep"
                }, {
                    "mData": "Oct"
                }, {
                    "mData": "Nov"
                }, {
                    "mData": "Dec"
                }],
                "aoColumnDefs": [{
                    "fnRender": function (oObj) {
                        if (oObj.aData["Jan"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('1', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Jan"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('1', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('1', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [0]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Feb"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('2', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Feb"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('2', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('2', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [1]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Mar"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('3', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Mar"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('3', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('3', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [2]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Apr"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('4', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Apr"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('4', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a  title='klik untuk isi bulan..' onclick=\"Detail('4', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [3]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["May"] == 'True') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('5', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["May"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('5', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('5', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [4]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Jun"] == 'True') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('6', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Jun"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('6', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('6', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [5]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Jul"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('7', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Jul"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('7', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('7', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [6]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Aug"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('8', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Aug"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('8', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('8', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [7]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Sep"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('9', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Sep"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('9', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('9', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [8]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Oct"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('10', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Oct"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('10', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('10', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [9]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Nov"] == 'True') {
                            return "<a title='klik untuk isi bulan..' onclick=\"Detail('11', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Nov"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('11', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('11', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [10]
                }, {
                    "fnRender": function (oObj) {
                        if (oObj.aData["Dec"] == 'True') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('12', 'True')\"><img src='../images/check.png' /></a>"
                        } else if (oObj.aData["Dec"] == 'Wait') {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('12', 'Wait')\"><img src='../images/question.png' /></a>"
                        } else {
                            return "<a title='klik untuk isi bulan..'  onclick=\"Detail('12', 'False')\"><img src='../images/cross.png' /></a>"
                        }
                    },
                    "aTargets": [11]
                }, {
                    "sClass": "center",
                    "aTargets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
                }, ]
            });
        }
    });


    function AddMoreFile() {
        if (!document.getElementById && !document.createElement) return false;
        var fileUpload = document.getElementById("fileupload");
        if (!fileUpload) return false;

        var newFile = document.createElement("input");
        newFile.type = "file";

        var newFile2 = document.createElement("input");
        newFile2.type = "button";

        if (!AddMoreFile.lastAssignedId) AddMoreFile.lastAssignedId = 100;
        newFile.setAttribute("id", "fileupload" + AddMoreFile.lastAssignedId);
        newFile.setAttribute("name", "fileupload" + AddMoreFile.lastAssignedId);

        newFile2.setAttribute("id", "button" + AddMoreFile.lastAssignedId);
        newFile2.setAttribute("name", "button" + AddMoreFile.lastAssignedId);
        newFile2.setAttribute("value", "hapus");
        
        var div = document.createElement("div");
        div.appendChild(newFile);
        //div.appendChild("<input type='button' id='btnDiv"+AddMoreFile.lastAssignedId+"' value='Delete'/>");
        //div.appendChild(newFile2);
        div.setAttribute("id", "div" + AddMoreFile.lastAssignedId);
        fileUpload.appendChild(div);
        AddMoreFile.lastAssignedId++;
    }

    function FileListRender(file) {
        document.getElementById("listfile").innerHTML = "";
        for (i = 0; i < file.length; i++) {
            if (!document.getElementById && !document.createElement) return false;
            var fileList = document.getElementById("listfile");
            if (!fileList) return false;

            if (!FileListRender.lastAssignedId) FileListRender.lastAssignedId = 100;

            var filename = file[i].DocumentFileName.split("/");

            fileList.innerHTML += '<div id="filelist' + FileListRender.lastAssignedId + '"><a href="#" id="filename' + FileListRender.lastAssignedId + '" onclick=GetAttachment("' + file[i].DocumentFileName + '")>' + filename[filename.length - 1] + '</a></div>'

            FileListRender.lastAssignedId++;
        }
    }

    function GetAttachment(file) {
        document.location = file;
        return false;
    }

    function Detail(month, state) {
        $("#MainContent_txt_month").val(ConvertSelectedMonthName(month));
        $("#MainContent_txt_monthnumber").val(month);
        $("#MainContent_State").val(state);
        $("#tr_notice").hide();
        //alert(state);
        if (state == 'False') {
            $.ajax({
                "dataType": 'json',
                "type": "GET",
                "url": "../Serializer/KPIAchievementSerializer.ashx?KPIAssign=" + $("#MainContent_KPIAssign").val() + "&Year=" + $("#MainContent_txt_achievementyear").val() + "&Month=" + month + "&User=" + $("#txt_user").val(),
                "success": function (data) {
                    if (data.result != null) {
                        //if (data.result.isLocked.toString() == 'true' && data.result.CreateBy.toString() == $("#txt_user").val()) {
                        if (data.isCreator) {
                            $("#MainContent_txt_realization").removeAttr("disabled");
                            $("#MainContent_txt_realizationmonth").removeAttr("disabled");
                            $("#MainContent_fileattachment").removeAttr("disabled");
                            $("#btn_addfile").removeAttr("disabled");
                            $("#MainContent_ddl_statusbyuser").removeAttr("disabled");
                            $("#MainContent_ddl_statusbyuser").show();
                            $("#MainContent_txt_statusbyuser").hide();
                            $("#MainContent_ddl_statusbyverificator").show();
                            $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
                            $("#MainContent_txt_statusbyverificator").hide();
                            //$("#MainContent_txt_score").removeAttr("disabled");
                            $("#MainContent_txt_remark").removeAttr("disabled");

                            $("#MainContent_txt_realization").val('');
                            $("#MainContent_txt_realizationmonth").val('');
                            $("#MainContent_txt_realizationmonthtext").val('');
                            $("#MainContent_txt_score").val('');
                            $("#MainContent_txt_scoreval").val('');
                            $("#MainContent_txt_remark").val('');

                            $("#fileupload").show();
                            $("#addfile").show();
                            $("#listfile").hide();

                            $("#btn_count").show();

                            if($("#MainContent_ScoredBySystem").val() == 'False')
                                $("#MainContent_btn_save").show();
                            else
                                $("#MainContent_btn_save").hide();

                            $("#MainContent_btn_lock").hide();   
                            $("#MainContent_chk_locked").attr("Checked", true);

                            $("#form1 td input[type='checkbox']").each(function () {
                                var $cb = $(this);
                                if ($cb.attr('id') == 'MainContent_chk_locked') {
                                    if (data.result.isLocked.toString() == 'true') $cb.prop('checked', true);
                                    else $cb.prop('checked', false);
                                }
                            });
                        } else {
                            $("#MainContent_txt_realization").attr("disabled");
                            $("#MainContent_txt_realizationmonth").attr("disabled");
                            $("#MainContent_fileattachment").removeAttr("disabled");
                            $("#btn_addfile").removeAttr("disabled");
                            $("#MainContent_ddl_statusbyuser").removeAttr("disabled");
                            $("#MainContent_ddl_statusbyuser").show();
                            $("#MainContent_txt_statusbyuser").hide();
                            $("#MainContent_ddl_statusbyverificator").show();
                            $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
                            $("#MainContent_txt_statusbyverificator").hide();
                            //$("#MainContent_txt_score").removeAttr("disabled");
                            $("#MainContent_txt_remark").removeAttr("disabled");

                            $("#MainContent_txt_realization").val('');
                            $("#MainContent_txt_realizationmonth").val('');
                            $("#MainContent_txt_realizationmonthtext").val('');
                            $("#MainContent_txt_score").val('');
                            $("#MainContent_txt_scoreval").val('');
                            $("#MainContent_txt_remark").val('');

                            $("#fileupload").show();
                            $("#addfile").show();
                            $("#listfile").hide();

                            $("#btn_count").hide();
                            $("#MainContent_btn_save").hide();
                            $("#MainContent_btn_lock").hide();

                            $("#form1 td input[type='checkbox']").each(function () {
                                var $cb = $(this);
                                if ($cb.attr('id') == 'MainContent_chk_locked') {
                                    if (data.result.isLocked.toString() == 'true') $cb.prop('checked', true);
                                    else $cb.prop('checked', false);
                                }
                            });
                        }
                    } else {
                        $("#MainContent_txt_realization").removeAttr("disabled");
                        $("#MainContent_txt_realizationmonth").removeAttr("disabled");
                        $("#MainContent_fileattachment").removeAttr("disabled");
                        $("#btn_addfile").removeAttr("disabled");
                        $("#MainContent_ddl_statusbyuser").removeAttr("disabled");
                        $("#MainContent_ddl_statusbyuser").show();
                        $("#MainContent_txt_statusbyuser").hide();
                        $("#MainContent_ddl_statusbyverificator").show();
                        $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
                        $("#MainContent_txt_statusbyverificator").hide();
                        //$("#MainContent_txt_score").removeAttr("disabled");
                        $("#MainContent_txt_remark").removeAttr("disabled");

                        $("#MainContent_txt_realization").val('');
                        $("#MainContent_txt_realizationmonth").val('');
                        $("#MainContent_txt_realizationmonthtext").val('');
                        $("#MainContent_txt_score").val('');
                        $("#MainContent_txt_scoreval").val('');
                        $("#MainContent_txt_remark").val('');

                        $("#fileupload").show();
                        $("#addfile").show();
                        $("#listfile").hide();

                        $("#btn_count").show();

                        if($("#MainContent_ScoredBySystem").val() == 'False')
                        {
                            $("#MainContent_btn_save").show();
                            $("#MainContent_btn_lock").show();
                        }
                        else
                        {
                            $("#MainContent_btn_save").hide();
                            $("#MainContent_btn_lock").hide();
                        }
                           
                        $("#form1 td input[type='checkbox']").each(function () {
                            var $cb = $(this);
                            if ($cb.attr('id') == 'MainContent_chk_locked') {
                                $cb.prop('checked', false);
                            }
                        });
                    }
                },
                "error": function (data) {
                    alert('Error on getting achievement data');
                }
            });
        } else if (state == 'Wait') {
            $("#tr_notice").show();
            $("#fileupload").show();
            $("#addfile").show();
            $("#listfile").show();
            $("#MainContent_ddl_statusbyuser").show();
            $("#MainContent_txt_statusbyuser").hide();
            $("#MainContent_txt_realization").attr("disabled", "disabled");
            $("#MainContent_txt_realizationmonth").attr("disabled", "disabled");

            $.ajax({
                "dataType": 'json',
                "type": "GET",
                "url": "../Serializer/KPIAchievementSerializer.ashx?KPIAssign=" + $("#MainContent_KPIAssign").val() + "&Year=" + $("#MainContent_txt_achievementyear").val() + "&Month=" + month + "&User=" + $("#txt_user").val(),
                "success": function (data) {
                    $("#MainContent_txt_realization").val(data.result.Realization);
                    $("#MainContent_txt_realizationmonth").val(data.result.Realization);
                    $("#MainContent_txt_realizationmonthtext").val(data.result.Realization);
                    //$("#MainContent_txt_statusbyuser").val(data.result.StatusByUser.Description);
                    $("#MainContent_ddl_statusbyuser").val(data.result.StatusByUser.Description);
                    $("#MainContent_txt_score").val(data.result.Score);
                    $("#MainContent_txt_scoreval").val(data.result.Score);
                    $("#MainContent_txt_remark").val(data.result.Notes);
                    FileListRender(data.attachment);

                    //alert(data.result.isLocked);

                    $("#form1 td input[type='checkbox']").each(function () {
                        var $cb = $(this);
                        if ($cb.attr('id') == 'MainContent_chk_locked') {
                            if (data.result.isLocked.toString() == 'true') $cb.prop('checked', true);
                            else $cb.prop('checked', false);

                             if(data.result.isLocked)
                               {
                                    $cb.prop('disabled', true);
                               }
                        }
                    });

                    //$("#MainContent_ddl_statusbyverificator").removeAttr("disabled");
                    $("#MainContent_ddl_statusbyverificator").show();
                    $("#MainContent_txt_statusbyverificator").hide();
                    //$("#MainContent_txt_score").removeAttr("disabled");
                    $("#MainContent_fileattachment").removeAttr("disabled");
                    $("#btn_addfile").removeAttr("disabled");
                    $("#MainContent_ddl_statusbyuser").removeAttr("disabled");
                    $("#MainContent_txt_realization").removeAttr("disabled");
                    $("#MainContent_txt_realizationmonth").removeAttr("disabled");
                    $("#MainContent_txt_remark").removeAttr("disabled");

                    // $("#MainContent_chk_locked").removeAttr("disabled");

                    if($("#MainContent_ScoredBySystem").val() == 'False')
                        $("#MainContent_btn_save").show();                     
                    else
                        $("#MainContent_btn_save").hide();

                    $("#btn_count").show();

                    $("#MainContent_btn_lock").hide();


                    if(data.result.isLocked)
                    {
                       $("#MainContent_txt_statusbyuser").val(data.result.StatusByUser.Description);
                        $("#fileupload").hide();
                        $("#addfile").hide();
                        $("#listfile").show();
                        $("#MainContent_ddl_statusbyuser").hide();
                        $("#MainContent_txt_statusbyuser").show();
                        $("#MainContent_ddl_statusbyverificator").hide();
                        $("#MainContent_txt_statusbyverificator").show();

                        $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
                        //$("#MainContent_txt_score").attr("disabled", "disabled");
                        $("#MainContent_txt_remark").attr("disabled", "disabled");
                        $("#MainContent_txt_statusbyverificator").attr("disabled", "disabled");
                        $("#MainContent_txt_realizationmonth").attr("disabled", "disabled");
                        $("#MainContent_txt_realization").attr("disabled", "disabled");
                         $("#btn_count").hide();
                         $("#MainContent_txt_score").attr("disabled", "disabled");
                    }
                },
                "error": function (data) {
                    alert('Error on getting achievement data');
                }
            });
        } else if (state == 'True') {
            $("#fileupload").hide();
            $("#addfile").hide();
            $("#listfile").show();
            $("#MainContent_ddl_statusbyuser").hide();
            $("#MainContent_txt_statusbyuser").show();
            $("#MainContent_ddl_statusbyverificator").hide();
            $("#MainContent_txt_statusbyverificator").show();

            $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
            //$("#MainContent_txt_score").attr("disabled", "disabled");
            $("#MainContent_txt_remark").attr("disabled", "disabled");
            $("#MainContent_txt_statusbyverificator").attr("disabled", "disabled");
            $("#MainContent_txt_realizationmonth").attr("disabled", "disabled");
            $("#MainContent_txt_realization").attr("disabled", "disabled");

            $.ajax({
                "dataType": 'json',
                "type": "GET",
                "url": "../Serializer/KPIAchievementSerializer.ashx?KPIAssign=" + $("#MainContent_KPIAssign").val() + "&Year=" + $("#MainContent_txt_achievementyear").val() + "&Month=" + month + "&User=" + $("#txt_user").val(),
                "success": function (data) {
                    $("#MainContent_txt_realization").val(data.result.Realization);
                    $("#MainContent_txt_realizationmonth").val(data.result.Realization);
                    $("#MainContent_txt_realizationmonthtext").val(data.result.Realization);
                    $("#MainContent_txt_statusbyuser").val(data.result.StatusByUser.Description);
                    $("#MainContent_txt_statusbyverificator").val(data.result.StatusByVerificator.Description);
                    $("#MainContent_txt_score").val(data.result.Score);
                    $("#mainContent_txt_scoreval").val(data.result.Score);
                    $("#MainContent_txt_remark").val(data.result.Notes);

                    $("#form1 td input[type='checkbox']").each(function () {
                        var $cb = $(this);
                        if ($cb.attr('id') == 'MainContent_chk_locked') {
                            if (data.result.isLocked.toString() == 'true') 
                                $cb.prop('checked', true);
                            else 
                            $cb.prop('checked', false);

                            $cb.prop('disabled', true);
                        }
                    });

                    

                    FileListRender(data.attachment);
                },
                "error": function (data) {
                    alert('Error on getting achievement data');
                }
            });

            $("#btn_count").hide();
            $("#MainContent_btn_save").hide();
            $("#MainContent_btn_lock").hide();
        }

        return false;
    }

    function ConvertSelectedMonthName(Month) {
        var Name = "";
        if (Month == 1) {
            Name = "January";
        } else if (Month == 2) {
            Name = "February";
        } else if (Month == 3) {
            Name = "March"
        } else if (Month == 4) {
            Name = "April"
        } else if (Month == 5) {
            Name = "May"
        } else if (Month == 6) {
            Name = "June"
        } else if (Month == 7) {
            Name = "July"
        } else if (Month == 8) {
            Name = "August"
        } else if (Month == 9) {
            Name = "September"
        } else if (Month == 10) {
            Name = "October"
        } else if (Month == 11) {
            Name = "November"
        } else if (Month == 12) {
            Name = "December"
        }
        return Name;
    }

    function InitPage() {
        $("#timeline").hide();
        $("#listfile").hide();
        $("#MainContent_txt_statusbyuser").hide();
        $("#MainContent_txt_statusbyverificator").hide();
        $("#MainContent_btn_save").hide();
        $("#MainContent_btn_lock").hide();
        $("#btn_count").hide();
        ClearContent();

        $("#MainContent_txt_realization").attr("disabled", "disabled");
        $("#MainContent_txt_realizationmonth").attr("disabled", "disabled");
        $("#MainContent_ddl_statusbyuser").attr("disabled", "disabled");
        $("#MainContent_ddl_statusbyverificator").attr("disabled", "disabled");
        $("#MainContent_txt_remark").attr("disabled", "disabled");
        //$("#MainContent_txt_score").attr("disabled", "disabled");
        $("#MainContent_fileattachment").attr("disabled", "disabled");
        $("#btn_addfile").attr("disabled", "disabled");

        $("#tr_notice").hide();

        //$("#div_child").hide();
    }

    function ClearContent() {
        $("#MainContent_State").val('');
        $("#MainContent_txt_month").val('');
        $("#MainContent_txt_monthnumber").val('');
        $("#MainContent_txt_realization").val('');
        $("#MainContent_txt_realizationmonth").val('');
        $("#MainContent_txt_realizationmonthtext").val('');
        $("#MainContent_txt_score").val('');
        $("#MainContent_txt_scoreval").val('');
        $("#MainContent_txt_remark").val('');
    }

    function ShowAttachments(KPIID)
    {
        var winFeature = "dialogHeight:500;dialogWidth:1000;center:yes;resizeable:no;scroll:yes";
        window.showModalDialog("../Tools/ShowAttachments/ShowAttachments.aspx?KPI=" + KPIID + "&User=" + $("#txt_user").val() + "&Year=" + $("#MainContent_txt_achievementyear").val(), null, winFeature);
    }
    </script>
    <style>
        .fg-toolbar
        {
            display: none;
        }
        .ui-datepicker-calendar
        {
            display: none;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <form id="formInputaAchievement" action="AchievementPage.aspx">
    <div>
        <div class="customPageTitle">
            KPI Information</div>
        <br />
        <div class="customPageContent">
            <table width="100%">
                <tr>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">
                                    Description
                                </td>
                                <td class="Separator">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpidescription" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Group
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpigroup" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Category
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpicategory" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Type
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpitype" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Sub Type
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpisubtype" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Year
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiyear" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Periode
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiperiode" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>
                           
                           <%-- <tr>
                                <td style="vertical-align: top">
                                    Detail Information
                                </td>
                                <td style="vertical-align: top">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_detailinformation" runat="server" ReadOnly="true" TextMode="MultiLine"
                                        CssClass="MultilineTextbox"></asp:TextBox>
                                </td>
                            </tr>--%>
                        </table>
                    </td>
                    <td width="50%">
                        <table>

                         <tr>
                                <td>
                                    Polarization
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_polarization" runat="server"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Unit of Measure
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiuom" runat="server" ReadOnly="true" class="longText"></asp:TextBox><input
                                        type="hidden" runat="server" id="txt_uomformat" />
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    UoM Max
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiuommax" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    UoM Min
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiuommin" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>

                           <%-- <tr>
                                <td width="140px">
                                    Target Description
                                </td>
                                <td class="Separator">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpitargetdescription" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Manual Calculation
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpimanualcalculation" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Calculation Type
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_calculationtype" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>--%>
                            <tr>
                                <td>
                                    Weight
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_weight" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>
                           <%-- <tr>
                                <td>
                                    KPI Parent
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpiparent" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    KPI Replacement
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_kpireplacement" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Replacement Date
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_replacementdate" runat="server" ReadOnly="true"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Replacement Desc.
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_replacementdescription" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Weight Enable Flag
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:CheckBox ID="chk_weightenableflag" runat="server" Enabled="false" />
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    UoM Enable Flag
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:CheckBox ID="chk_uomenableflag" runat="server" Enabled="false" />
                                </td>
                            </tr>--%>
                            <tr>
                                <td>
                                    is Active
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:CheckBox ID="chk_active" runat="server" Enabled="false" />
                                </td>
                            </tr>
                           <%-- <tr>
                                <td>
                                    Scored By System
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:CheckBox ID="chk_scoredbysystem" runat="server" Enabled="false" />
                                </td>
                            </tr>
                            <tr>
                                <td style="vertical-align: top">
                                    Strategic Objective
                                </td>
                                <td style="vertical-align: top">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_strategicobjective" runat="server" ReadOnly="true" TextMode="MultiLine"
                                        CssClass="MultilineTextbox"></asp:TextBox>
                                </td>
                            </tr>--%>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
        <br />
        <div id="div_child">
            <div class="customPageTitle">
                KPI Childs</div>
            <br />
            <div class="ui-widget-content">
                <table cellpadding="0" cellspacing="0" class="display" id="KPIChildTable">
                    <thead>
                        <tr>
                            <th>
                                No
                            </th>
                            <th>
                                Description
                            </th>
                            <th>
                                isActive
                            </th>
                            <th>
                                Group
                            </th>
                            <th>
                                Category
                            </th>
                            <th>
                                Type
                            </th>
                            <th>
                                Sub Type
                            </th>
                            <th>
                                Periode
                            </th>
                            <th>
                                Attachments
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
        <br />
        <div class="customPageTitle">
            KPI Achievement</div>
        <br />
        <div style="margin: 5px 5px 5px 5px">
            Achievement Year :
            <asp:TextBox ID="txt_achievementyear" runat="server" ReadOnly="true" class="mandatory"></asp:TextBox><br />
            <input type="hidden" id="KPI" runat="server" /><input type="hidden" id="KPIAssign"
                runat="server" /><input type="hidden" id="KPIAssignDetail" runat="server" /><input
                    type="hidden" id="State" runat="server" /><input type="hidden" id="ScoredBySystem"
                        runat="server" />
        </div>
        <div class="ui-widget-content">
            <table cellpadding="0" cellspacing="0" class="display" id="timeline">
                <thead>
                    <tr>
                        <th>
                            Jan
                        </th>
                        <th>
                            Feb
                        </th>
                        <th>
                            Mar
                        </th>
                        <th>
                            Apr
                        </th>
                        <th>
                            May
                        </th>
                        <th>
                            Jun
                        </th>
                        <th>
                            Jul
                        </th>
                        <th>
                            Aug
                        </th>
                        <th>
                            Sep
                        </th>
                        <th>
                            Oct
                        </th>
                        <th>
                            Nov
                        </th>
                        <th>
                            Dec
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <br />
        <div class="customPageContent">
            <table width="100%">
                <tr>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">
                                    Month
                                </td>
                                <td class="Separator">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_month" runat="server" ReadOnly="true" class="mandatory"></asp:TextBox><input
                                        type="hidden" id="txt_monthnumber" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Realization
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_realization" runat="server" Enabled="false" class="mandatory"></asp:TextBox>
                                    <asp:TextBox ID="txt_realizationmonth" runat="server" class="mandatory date-picker"></asp:TextBox>
                                    <input type="hidden" id="txt_realizationmonthtext" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Attachment
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <div id="fileupload">
                                        <asp:FileUpload ID="fileattachment" runat="server" Enabled="false" /><br />
                                    </div>
                                    <div id="addfile">
                                        <input id="btn_addfile" type="button" value="Add file" onclick="AddMoreFile();" disabled="disabled" />
                                    </div>
                                    <div id="listfile">
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Status By User
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:DropDownList ID="ddl_statusbyuser" runat="server" Enabled="false">
                                    </asp:DropDownList>
                                    <asp:TextBox ID="txt_statusbyuser" runat="server" Enabled="false"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    is Locked
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:CheckBox ID="chk_locked" runat="server" Enabled="true" />
                                </td>
                            </tr>
                        </table>
                    </td>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">
                                    Score
                                </td>
                                <td class="Separator">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_score" runat="server" class="mandatory"></asp:TextBox>&nbsp;<input
                                        type="button" id="btn_count" value="Count" /><input type="hidden" runat="server"
                                            id="txt_scoreval">
                                </td>
                            </tr>
                            <tr>
                                <td width="140px">
                                    Status By Verificator
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <asp:DropDownList ID="ddl_statusbyverificator" runat="server" Enabled="false">
                                    </asp:DropDownList>
                                    <asp:TextBox ID="txt_statusbyverificator" runat="server"></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td style="vertical-align: top">
                                    Remark
                                </td>
                                <td style="vertical-align: top">
                                    :
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_remark" runat="server" TextMode="MultiLine" CssClass="MultilineTextbox"
                                        Enabled="false"></asp:TextBox>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr runat="server" visible="true" id="tr_notice">
                    <td colspan="2" style="color: Red">
                        Attached files will be removed on update process, please re-upload your attachments
                        before update!!!
                    </td>
                </tr>
            </table>
        </div>
        <br />
        <button id="btn_save" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary"
            runat="server" name="btnSave" onserverclick="SaveAction">
            <span class="ui-button-icon-primary ui-icon ui-icon-check"></span>
            <label class="ui-button-text">
                Save</label>
        </button>
      <%--  <button id="btn_lock" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary"
            runat="server" name="btnLock" onserverclick="LockAction">
            <span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
            <label class="ui-button-text">
                Lock</label>
        </button>--%>
        <button id="btn_back" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary">
            <span class="ui-button-icon-primary ui-icon ui-icon-arrowthick-1-w"></span>
            <label class="ui-button-text">
                Back</label>
        </button>
    </div>
    </form>
</asp:Content>
